define(function (require, exports, module) {       
    
  var statusbarTemplate = require("../tpl/statusbar.tpl");     
  var StatusBar = Backbone.View.extend({
  tag: "div",      
  template: _.template(statusbarTemplate),   
      
  attributes: {
     "class":"statusbar"
  },
  events: { 
      "change input[type='range']": "scale",
      "change select" : "zoom"
  }, 
  initialize: function(){ 
      _.bindAll(this, "resize", "height", "render", "scale", "zoom");
      Backbone.on("mainview:resize", this.resize);    
  },
  
  resize: function(param){
     this.$el.css({left: param.sidebar_width,                     
                    right: 0, 
                    bottom: 0});
  },
  zoom : function(){
     this.model.pdfdoc.trigger("zoom:fitwidth"); 
  },
  scale: function(){   
    var scale = this.$("input[type='range']").val()/100;
    this.model.pdfdoc.set("scale", scale);    
  },
      
  height: function(){
    return this.$el.is(":visible") ? this.model.height: 0;
  },
      
  render: function(){
    this.$el.html(this.template({}));
    this.$el.height(this.model.height);
    return this;
  }
 
});

module.exports = StatusBar;
});